<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<script language="Javascript"></script>
    <title>iDash Fluid Admin Panel</title>
    <!-- Include styles -->
    <link href="styles/reset.css" rel="stylesheet" type="text/css">
    <link href="styles/style.css" rel="stylesheet" type="text/css">
    <link href="styles/datatables.css" rel="stylesheet" type="text/css">
    <link href="styles/buttons.css" rel="stylesheet" type="text/css">
    <link href="styles/visualize.css" rel="stylesheet" type="text/css">
    <link href="styles/jqtransform.css" rel="stylesheet" type="text/css">
    <!-- Inculude JS -->
    <script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="js/jquery.datatables.js"></script>
    <script type="text/javascript" src="js/jquery.visualize.js"></script>
	<script type="text/javascript" src="js/jquery.selectskin.js"></script>
    <script type="text/javascript" src="js/notes.js"></script>
    <script type="text/javascript" src="js/custom.js"></script>

	</head>

<body>

<!-- Start Container -->
<div class="container">

	<div id="header">
    
    	<div id="header-right">
        
       	  <div id="user-card">
            
            	<div id="user-meta">
                
                	Welcome Back <a href="#">Tyler</a><br>
                    <a href="#">5 New Messages</a> And <a href="#">2 Notifications</a><br>
                    <span>Last Login: 11/16/2010 at 10:53 PM</span>
                
                </div>
                
                <a href="#"><img class="avatar" src="images/avatar.png" alt="avatar"></a>
                
            </div>
            
        </div>
        
        <p class="logo"><a href="#"><img src="images/logo.png" border="0" alt="logo"></a></p>
        
        <br class="clear">
        
    </div>
    
    
    <div id="cpanel">
    
    	<div id="primary">
        
            <ul>
            
                <li class="current">
                    <a href="index.html">
                    <span class="icon icon_computer_off"></span>
                    <span class="label">Dashboard</span>
                    </a>
                </li>

                <li>
                    <a href="grid.html">
                    <span class="icon icon_measures"></span>
                    <span class="label">Full Grid</span>
                    </a>
                </li>

                <li>
                    <a href="charts.html">
                    <span class="icon icon_graph_areas"></span>
                    <span class="label">Charts</span>
                    </a>
                </li>

                <li>
                    <a href="notifications.html">
                    <span class="icon icon_comment_ok"></span>
                    <span class="label">Notifications</span>
                    </a>
                </li>
                
                <li>
                    <a href="datatables.html">
                    <span class="icon icon_frame"></span>
                    <span class="label">Datatables</span>
                    </a>
                </li>
                
                <li>
                    <a href="buttons.html">
                    <span class="icon icon_disk"></span>
                    <span class="label">Buttons / Icons</span>
                    </a>
                </li>
                
                <li>
                    <a href="type.html">
                    <span class="icon icon_fonts"></span>
                    <span class="label">Type &amp; Forms</span>
                    </a>
                </li>
                                            
            </ul>
                                  
        </div>
    
    
    	<div id="secondary">
        
        	<ul>
            
            	<li class="current"><a href="#tabone">Main Tab</a></li>
                <li><a href="#tabtwo">View Form Styles</a></li>
                <li><a href="#tabthree">Tab Usage</a></li>
                            
            </ul>
            
            <br class="clear">
            
        </div>
    
    
    
    	<div id="panel-inner">
        
        	<div id="tabone" class="panel">
            
            	<div class="grid onehalf">
            
                    <h2>Welcome to iDash</h2>
                    
                    <p>iDash is a ready to use Admin Control Panel theme with all kinds of powerful features. iDash includes a custom notification system, data tables for easily sorting / paginating data, full charting support for all kinds of graphs, comes packed with icons which are ready to use with buttons and navigations, and its 100% grid ready down to 6 columns!</p>
                    
                    <p>Check out the rest of this live preview of all the goodness.</p>
                    
                </div>
                
                <div class="grid onehalf last">
                           
                    <br><h2>Notification Demo</h2>
                  
                            <p>iDash Admin Panel uses a custom built notification system that makes it easy to display sleek notifications to your user. The user will be scrolled to the top of the page and then recieve the notification that can be closed simply by clicking anywhere inside it.</p>
                            
                            <a class="button icon approve" onclick="notify('&lt;strong&gt;Success&lt;/strong&gt; You clicked the button!', 'success');" href="#">Success Notification</a>
                            
                            <a class="button icon remove" onclick="notify('&lt;strong&gt;Warning&lt;/strong&gt; Are you sure you want to remove this item?', 'warning');" href="#">Warning Notification</a>
            
                            <a class="button icon danger remove" onclick="notify('&lt;strong&gt;Error&lt;/strong&gt; Oh No! Something went wrong.', 'error');" href="#">Error Notification</a><br><br>
            
                          <a class="button icon approve" onclick="notify('&lt;strong&gt;Tip&lt;/strong&gt; Notifications can be called via almost any event!', 'tip');" href="#">Tip Notification</a>
            
                          <a class="button icon settings" onclick="notify('&lt;strong&gt;Neutral&lt;/strong&gt; Arent these notifications sexy?', 'neutral');" href="#">Neutral Notification</a>
				
			   </div><br class="clear">
               
               <div class="grid left third">
               
                   <h2>Sortable, Paginated Tables With Datatables</h2>

                	<h3>Information</h3>
                    <p>iDash also makes adding tables to your admin panel easy as well. Create datatables that allow you to paginate, search, filter, and sort data by simply adding a class to them.</p>
                	<pre>&lt;table class="datatable"&gt;</pre>
                    
                    <h3>Sorting</h3>
                    <p>Notice how you can sort either ascendingly or descendingly by clicking on the column headers. You can also page through the data, and fliter it by using the search box above the table.</p>
               
               </div>
               
               <div class="grid right twothird">
                   
                  <div class="dataTables_wrapper"><div class="dataTables_length"><label>Show <div class="cmf-skinned-select" style="width: 98px; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-size: 13px; font-family: Arial; font-style: normal; position: relative; "><div class="cmf-skinned-text" style="height: 19px; width: 61px; opacity: 100; overflow-x: hidden; overflow-y: hidden; position: absolute; text-indent: 0px; z-index: 1; top: 0px; left: 0px; ">10</div><select size="1" style="opacity: 0; position: relative; z-index: 100; "><option value="10">10</option><option value="25">25</option><option value="50">50</option><option value="100">100</option></select></div> entries</label></div><div class="dataTables_filter"><label><input type="text"></label></div><table class="datatable">
                    <thead>
                      <tr><th class="sorting_asc" rowspan="1" colspan="1" style="width: 142px; ">Client</th><th class="sorting" rowspan="1" colspan="1" style="width: 161px; ">Email Address</th><th class="sorting" rowspan="1" colspan="1" style="width: 135px; ">Payment Made</th><th class="sorting" rowspan="1" colspan="1" style="width: 205px; ">Actions</th></tr>
                    </thead>
                
                    
                  <tbody><tr class="odd">
                        <td class=" sorting_1">Beyonce Knowles</td>
                        <td>bk@email.com</td>
                        <td>6/20/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="even">
                        <td class=" sorting_1">Caleb Followill</td>
                        <td>claeb@email.com</td>
                        <td>8/1/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="odd">
                        <td class=" sorting_1">Curtis Jackson</td>
                        <td>curtisj@email.com</td>
                        <td>7/12/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="even">
                        <td class=" sorting_1">Dale Allen</td>
                        <td>allen@email.com</td>
                        <td>7/22/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="odd">
                        <td class=" sorting_1">Dewey Cox</td>
                        <td>dcox@email.com</td>
                        <td>8/2/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="even">
                        <td class=" sorting_1">Jim Jones</td>
                        <td>jimjones@email</td>
                        <td>8/1/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="odd">
                        <td class=" sorting_1">Jimmy Ivine</td>
                        <td>jivine@email.com</td>
                        <td>8/3/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="even">
                        <td class=" sorting_1">Marshall Mathers</td>
                        <td>mathers@email.com</td>
                        <td>8/3/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="odd">
                        <td class=" sorting_1">Michelle Colwell</td>
                        <td>michelle@email.com</td>
                        <td>6/18/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr><tr class="even">
                        <td class=" sorting_1">Mike Hunt</td>
                        <td>mrhunt@email.com</td>
                        <td>8/3/2011</td>
                        <td>
                          <span class="button-group">
                            <a href="#" class="button icon edit">Edit</a>
                            <a href="#" class="button icon remove danger">Remove</a>
                          </span>
                        </td>
                      </tr></tbody></table><div class="dataTables_info">Showing 1 to 10 of 13 entries</div><div class="dataTables_paginate paging_two_button"><div class="paginate_disabled_previous" title="Previous"></div><div class="paginate_enabled_next" title="Next"></div></div></div>
                  
                  </div><br class="clear">
                                                
				<div class="grid left third">
                
                	<h2>From Tables to Charts</h2>
                
                	<p>iDash allows you to quickly and easily create charts on the fly by simply adding a class to the desired table of data!</p>
                    
                </div>
                
				<div class="grid right twothird">
                
                    <table class="areachart" style="display: none; ">
                            <thead>
                              <tr>
                                <td></td>
                                <th scope="col">Jan</th>
                                <th scope="col">Feb</th>
                                <th scope="col">Mar</th>
                                <th scope="col">Apr</th>
                                <th scope="col">May</th>
                              </tr>
                            </thead>
                        
                            <tbody>
                              <tr>
                                <th scope="row">Data row 1</th>
                                <td>12</td>
                                <td>31</td>
                                <td>40</td>
                                <td>61</td>
                                <td>72</td>
                              </tr>
                              <tr>
                                <th scope="row">Data row 2</th>
                                <td>3</td>
                                <td>5</td>
                                <td>33</td>
                                <td>64</td>
                                <td>21</td>
                              </tr>
                              <tr>
                                <th scope="row">Data row 3</th>
                                <td>20</td>
                                <td>41</td>
                                <td>10</td>
                                <td>50</td>
                                <td>22</td>
                              </tr>
                            </tbody>
                        </table><div class="visualize visualize-area" role="img" aria-label="Chart representing data from the table: " style="height: 250px; width: 711px; "><ul class="visualize-labels-x" style="width: 711px; height: 250px; "><li style="left: 0px; "><span class="line" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; "></span><span style="margin-left: 0px; " class="label">Jan</span></li><li style="left: 177.75px; "><span class="line"></span><span style="margin-left: -10px; " class="label">Feb</span></li><li style="left: 355.5px; "><span class="line"></span><span style="margin-left: -9.5px; " class="label">Mar</span></li><li style="left: 533.25px; "><span class="line"></span><span style="margin-left: -9.5px; " class="label">Apr</span></li><li style="left: 711px; "><span class="line" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; "></span><span style="margin-left: -21px; " class="label">May</span></li></ul><ul class="visualize-labels-y" style="width: 711px; height: 250px; "><li style="bottom: 250px; "><span class="line" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; "></span><span style="margin-top: 0px; " class="label">72</span></li><li style="bottom: 218.75px; "><span class="line"></span><span style="margin-top: -7px; " class="label">63</span></li><li style="bottom: 187.5px; "><span class="line"></span><span style="margin-top: -7px; " class="label">54</span></li><li style="bottom: 156.25px; "><span class="line"></span><span style="margin-top: -7px; " class="label">45</span></li><li style="bottom: 125px; "><span class="line"></span><span style="margin-top: -7px; " class="label">36</span></li><li style="bottom: 93.75px; "><span class="line"></span><span style="margin-top: -7px; " class="label">27</span></li><li style="bottom: 62.5px; "><span class="line"></span><span style="margin-top: -7px; " class="label">18</span></li><li style="bottom: 31.25px; "><span class="line"></span><span style="margin-top: -7px; " class="label">9</span></li><li style="bottom: 0px; "><span class="line" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; "></span><span style="margin-top: -14px; " class="label">0</span></li></ul><canvas height="250" width="711"></canvas><div class="visualize-info"><div class="visualize-title"></div><ul class="visualize-key"><li><span class="visualize-key-color" style="background: #45596a"></span><span class="visualize-key-label">Data row 1</span></li><li><span class="visualize-key-color" style="background: #5A599F"></span><span class="visualize-key-label">Data row 2</span></li><li><span class="visualize-key-color" style="background: #61C1DF"></span><span class="visualize-key-label">Data row 3</span></li></ul></div></div>
                      
                   <pre>&lt;table class="areachart"&gt;</pre>
                    
				</div><br class="clear">
                
              
              <h2>Dash Navigation Icons</h2>
              <p>iDash comes loaded with all kinds of icons for your dashboard navigation. With so many to choose from, iDash is perfect for ANY type of admin panel / backend needs!</p>
                
              <div class="grid dash" style="width:auto !important;">
              
                <img src="images/icons/icon_add.png" border="0" alt="icon">
                <img src="images/icons/icon_arrow_down.png" border="0" alt="icon">
                <img src="images/icons/icon_arrow_left.png" border="0" alt="icon">
                <img src="images/icons/icon_arrow_right.png" border="0" alt="icon">
                <img src="images/icons/icon_arrow_up.png" border="0" alt="icon">
                <img src="images/icons/icon_attach.png" border="0" alt="icon">
                <img src="images/icons/icon_auction.png" border="0" alt="icon">
                <img src="images/icons/icon_bell.png" border="0" alt="icon">
                <img src="images/icons/icon_bell_off.png" border="0" alt="icon">
                <img src="images/icons/icon_blog.png" border="0" alt="icon">
                <img src="images/icons/icon_book.png" border="0" alt="icon">
                <img src="images/icons/icon_bookmark.png" border="0" alt="icon">
                <img src="images/icons/icon_bookmark_add.png" border="0" alt="icon">
                <img src="images/icons/icon_book_marked.png" border="0" alt="icon">
                <img src="images/icons/icon_box.png" border="0" alt="icon">
                <img src="images/icons/icon_box_full.png" border="0" alt="icon">
                <img src="images/icons/icon_box_mail.png" border="0" alt="icon">
                <img src="images/icons/icon_brightness.png" border="0" alt="icon">
                <img src="images/icons/icon_brush.png" border="0" alt="icon">
                <img src="images/icons/icon_bulb_off.png" border="0" alt="icon">
                <img src="images/icons/icon_bulb_on.png" border="0" alt="icon">
                <img src="images/icons/icon_buzzer.png" border="0" alt="icon">
                <img src="images/icons/icon_calculator.png" border="0" alt="icon">
                <img src="images/icons/icon_calendar.png" border="0" alt="icon">
                <img src="images/icons/icon_call.png" border="0" alt="icon">
                <img src="images/icons/icon_cancel.png" border="0" alt="icon">
                <img src="images/icons/icon_case.png" border="0" alt="icon">
                <img src="images/icons/icon_checkmark.png" border="0" alt="icon">
                <img src="images/icons/icon_circle_arrow_left.png" border="0" alt="icon">
                <img src="images/icons/icon_circle_arrow_right.png" border="0" alt="icon">
                <img src="images/icons/icon_command_line.png" border="0" alt="icon">
                <img src="images/icons/icon_comment_add.png" border="0" alt="icon">
                <img src="images/icons/icon_comment_delete.png" border="0" alt="icon">
                <img src="images/icons/icon_comment_ok.png" border="0" alt="icon">
                <img src="images/icons/icon_computer_off.png" border="0" alt="icon">
                <img src="images/icons/icon_computer_on.png" border="0" alt="icon">
                <img src="images/icons/icon_contrast.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_1.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_2.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_3.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_4.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_5.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_6.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_7.png" border="0" alt="icon">
                <img src="images/icons/icon_controls_8.png" border="0" alt="icon">
                <img src="images/icons/icon_copy.png" border="0" alt="icon">
                <img src="images/icons/icon_court.png" border="0" alt="icon">
                <img src="images/icons/icon_credit_card.png" border="0" alt="icon">
                <img src="images/icons/icon_cut.png" border="0" alt="icon">
                <img src="images/icons/icon_danger.png" border="0" alt="icon">
                <img src="images/icons/icon_delete.png" border="0" alt="icon">
                <img src="images/icons/icon_disk.png" border="0" alt="icon">
                <img src="images/icons/icon_document.png" border="0" alt="icon">
                <img src="images/icons/icon_document_blank.png" border="0" alt="icon">
                <img src="images/icons/icon_dollar.png" border="0" alt="icon">
                <img src="images/icons/icon_download.png" border="0" alt="icon">
                <img src="images/icons/icon_error.png" border="0" alt="icon">
                <img src="images/icons/icon_favorities.png" border="0" alt="icon">
                <img src="images/icons/icon_favorities_add.png" border="0" alt="icon">
                <img src="images/icons/icon_favorities_remove.png" border="0" alt="icon">
                <img src="images/icons/icon_film.png" border="0" alt="icon">
                <img src="images/icons/icon_filming.png" border="0" alt="icon">
                <img src="images/icons/icon_first_aid.png" border="0" alt="icon">
                <img src="images/icons/icon_flag.png" border="0" alt="icon">
                <img src="images/icons/icon_flag_1.png" border="0" alt="icon">
                <img src="images/icons/icon_flash.png" border="0" alt="icon">
                <img src="images/icons/icon_flash_arrow.png" border="0" alt="icon">
                <img src="images/icons/icon_folder.png" border="0" alt="icon">
                <img src="images/icons/icon_folder_bookmark.png" border="0" alt="icon">
                <img src="images/icons/icon_folder_goto.png" border="0" alt="icon">
                <img src="images/icons/icon_font.png" border="0" alt="icon">
                <img src="images/icons/icon_fonts.png" border="0" alt="icon">
                <img src="images/icons/icon_font_capital.png" border="0" alt="icon">
                <img src="images/icons/icon_font_italic.png" border="0" alt="icon">
                <img src="images/icons/icon_font_regular.png" border="0" alt="icon">
                <img src="images/icons/icon_font_underline.png" border="0" alt="icon">
                <img src="images/icons/icon_forum.png" border="0" alt="icon">
                <img src="images/icons/icon_frame.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_areas.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_bars.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_bars_down.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_bars_up.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_down.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_lines.png" border="0" alt="icon">
                <img src="images/icons/icon_graph_up.png" border="0" alt="icon">
                <img src="images/icons/icon_hat.png" border="0" alt="icon">
                <img src="images/icons/icon_help.png" border="0" alt="icon">
                <img src="images/icons/icon_home.png" border="0" alt="icon">
                <img src="images/icons/icon_information.png" border="0" alt="icon">
                <img src="images/icons/icon_key.png" border="0" alt="icon">
                <img src="images/icons/icon_keyboard.png" border="0" alt="icon">
                <img src="images/icons/icon_laptop.png" border="0" alt="icon">
                <img src="images/icons/icon_link.png" border="0" alt="icon">
                <img src="images/icons/icon_list_bullets.png" border="0" alt="icon">
                <img src="images/icons/icon_list_numbers.png" border="0" alt="icon">
                <img src="images/icons/icon_lock.png" border="0" alt="icon">
                <img src="images/icons/icon_magnify_glass.png" border="0" alt="icon">
                <img src="images/icons/icon_mail.png" border="0" alt="icon">
                <img src="images/icons/icon_manage.png" border="0" alt="icon">
                <img src="images/icons/icon_measure.png" border="0" alt="icon">
                <img src="images/icons/icon_measures.png" border="0" alt="icon">
                <img src="images/icons/icon_mic.png" border="0" alt="icon">
                <img src="images/icons/icon_mic_1.png" border="0" alt="icon">
                <img src="images/icons/icon_minus.png" border="0" alt="icon">
                <img src="images/icons/icon_mute.png" border="0" alt="icon">
                <img src="images/icons/icon_paint.png" border="0" alt="icon">
                <img src="images/icons/icon_paperclip.png" border="0" alt="icon">
                <img src="images/icons/icon_paper_plane.png" border="0" alt="icon">
                <img src="images/icons/icon_paper_trash.png" border="0" alt="icon">
                <img src="images/icons/icon_paragraph.png" border="0" alt="icon">
                <img src="images/icons/icon_pencil.png" border="0" alt="icon">
                <img src="images/icons/icon_photo.png" border="0" alt="icon">
                <img src="images/icons/icon_piechart.png" border="0" alt="icon">
                <img src="images/icons/icon_post.png" border="0" alt="icon">
                <img src="images/icons/icon_profile.png" border="0" alt="icon">
                <img src="images/icons/icon_refresh.png" border="0" alt="icon">
                <img src="images/icons/icon_resize.png" border="0" alt="icon">
                <img src="images/icons/icon_rss.png" border="0" alt="icon">
                <img src="images/icons/icon_sad_face.png" border="0" alt="icon">
                <img src="images/icons/icon_safe.png" border="0" alt="icon">
                <img src="images/icons/icon_save.png" border="0" alt="icon">
                <img src="images/icons/icon_settings.png" border="0" alt="icon">
                <img src="images/icons/icon_shopping_bag.png" border="0" alt="icon">
                <img src="images/icons/icon_shopping_cart.png" border="0" alt="icon">
                <img src="images/icons/icon_shopping_heavy.png" border="0" alt="icon">
                <img src="images/icons/icon_sim.png" border="0" alt="icon">
                <img src="images/icons/icon_smile_face.png" border="0" alt="icon">
                <img src="images/icons/icon_sort_az.png" border="0" alt="icon">
                <img src="images/icons/icon_sort_za.png" border="0" alt="icon">
                <img src="images/icons/icon_star.png" border="0" alt="icon">
                <img src="images/icons/icon_storage.png" border="0" alt="icon">
                <img src="images/icons/icon_switch.png" border="0" alt="icon">
                <img src="images/icons/icon_tag.png" border="0" alt="icon">
                <img src="images/icons/icon_tag_add.png" border="0" alt="icon">
                <img src="images/icons/icon_tag_cancel.png" border="0" alt="icon">
                <img src="images/icons/icon_tag_delete.png" border="0" alt="icon">
                <img src="images/icons/icon_text_align_center.png" border="0" alt="icon">
                <img src="images/icons/icon_text_align_justify.png" border="0" alt="icon">
                <img src="images/icons/icon_text_align_left.png" border="0" alt="icon">
                <img src="images/icons/icon_text_align_right.png" border="0" alt="icon">
                <img src="images/icons/icon_time.png" border="0" alt="icon">
                <img src="images/icons/icon_timer.png" border="0" alt="icon">
                <img src="images/icons/icon_trash.png" border="0" alt="icon">
                <img src="images/icons/icon_twg.png" border="0" alt="icon">
                <img src="images/icons/icon_unlock.png" border="0" alt="icon">
                <img src="images/icons/icon_upload.png" border="0" alt="icon">
                <img src="images/icons/icon_user.png" border="0" alt="icon">
                <img src="images/icons/icon_users.png" border="0" alt="icon">
                <img src="images/icons/icon_volume.png" border="0" alt="icon">
                <img src="images/icons/icon_volume_down.png" border="0" alt="icon">
                <img src="images/icons/icon_volume_up.png" border="0" alt="icon">
                <img src="images/icons/icon_wallet.png" border="0" alt="icon">
                <img src="images/icons/icon_warning.png" border="0" alt="icon">
                <img src="images/icons/icon_wifi.png" border="0" alt="icon">
                <img src="images/icons/icon_window.png" border="0" alt="icon">
                <img src="images/icons/icon_window_error.png" border="0" alt="icon">
                <img src="images/icons/icon_window_globe.png" border="0" alt="icon">
                <img src="images/icons/icon_window_lock.png" border="0" alt="icon">
                <img src="images/icons/icon_zoom_in.png" border="0" alt="icon">
                <img src="images/icons/icon_zoom_out.png" border="0">
                
              </div>
                
                <br class="clear"> <!-- clear grid floats -->
                
            </div>
        
        	<div id="tabtwo" class="panel hidden">
            
                <h2>Form Styles</h2>

                <div class="grid onehalf">
                
                    <form action="/">
                    
                        <section>
                            <label for="name">Your Name</label>
                            <div><input id="name" name="name" type="text" placeholder="Only Letters"></div>
                        </section>
                    
                        <section>
                            <label for="email">Email Address</label>
                            <div><input id="email" name="email" type="text" placeholder="Valid Email"></div>
                        </section>
                      
                        <section>
                            <label for="username">Pick Username
                            <small>Letters and numbers only, no symbols or spaces.</small>
                            </label>
                            <div><input type="text" id="username" name="username" placeholder="Only letters" class="required" minlength="3"><a href="#" class="button icon loop" onclick="notify('&lt;strong&gt;WaHooO&lt;/strong&gt; This username is available!', 'success');">Check Name</a></div>
                        </section>
                      
                        <section>
                            <label for="password">Password
                            <small>Must be at least 8 characters and include at least one letter and one number.</small>
                            </label>
                            <div><input placeholder="At least 8 characters" name="password" id="password" type="password" class="required" minlength="6"><input name="confirm_password" type="password" placeholder="Confirm password"></div>
                        </section>
                        
                        <section>
                            <label for="address">Street Address<small>Please enter your <em>real</em> street address.</small></label>
                            <div>
                                <input name="address" id="address" placeholder="Street" type="text" class="large">
                                <input placeholder="#" type="text" class="small">
                            </div>
                        </section>
                        
                        <section>
                            <label>Zip Code</label>
                            <div>
                                <input placeholder="1234" type="text" class="small">
                                <input placeholder="AB" type="text" class="xsmall">
                            </div>
                        </section>
                        
                        <section>
                            <label for="textarea">Bio<small>This is a textarea example.</small></label>
                            <div><textarea class="required" id="textarea" name="textarea"></textarea></div>
                        </section>
                        
                	</form>   
 
				</div>

                <div class="grid onehalf last">
                
                <form>
                    <section>
                      <label for="tags">Tags<small>Sperated by Comma</small></label>
                      <div><input type="text" class="tags" name="tags" id="tags" value="awesome,tags"></div>
                    </section>
                    <section>
                        <label>Select Menus</label>
                        <div>
                            <div class="cmf-skinned-select" style="width: 98px; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); font-size: 13px; font-family: Arial; font-style: normal; position: relative; "><div class="cmf-skinned-text" style="height: 19px; width: 61px; opacity: 100; overflow-x: hidden; overflow-y: hidden; position: absolute; text-indent: 0px; z-index: 1; top: 0px; left: 0px; ">Menu Option One</div><select style="opacity: 0; position: relative; z-index: 100; ">
                                <option>Menu Option One</option>
                                <option>Another Menu Option</option>
                                <option>Looks Slick Dont It!</option>
                                <option>Very Clean Menu</option>
                            </select></div>
                        </div>
                    </section>
                    <section>
                        <label>Radio Buttons</label>
                        <div>
                            <div class="grid onehalf">
                                <input type="radio" name="radio" id="button1" class="hiddenCheckbox">
                                <label for="button1" class="prettyCheckbox radio list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Radio button 1</label>
                                <input type="radio" name="radio" id="button2" class="hiddenCheckbox">
                                <label for="button2" class="prettyCheckbox radio list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Radio button 2</label>
                                <input type="radio" name="radio" id="button3" class="hiddenCheckbox">
                                <label for="button3" class="prettyCheckbox radio list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Radio button 3</label>
                            </div>
                            <div class="grid onehalf last">
                                <input type="radio" name="radio" id="button4" class="hiddenCheckbox">
                                <label for="button4" class="prettyCheckbox radio list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Radio button 4</label>
                                <input type="radio" name="radio" id="button5" class="hiddenCheckbox">
                                <label for="button5" class="prettyCheckbox radio list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Radio button 5</label>
                            </div>
                            <br class="clear">
                        </div>
                    </section>
                    <section>
                        <label>Check boxes</label>
                        <div>
                            <div class="grid onehalf">
                                <input type="checkbox" name="checkbox" id="checkbox1" class="hiddenCheckbox">
                                <label for="checkbox1" class="prettyCheckbox checkbox list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Checkbox 1</label>
                                <input type="checkbox" name="checkbox" id="checkbox2" class="hiddenCheckbox">
                                <label for="checkbox2" class="prettyCheckbox checkbox list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Checkbox 2</label>
                                <input type="checkbox" name="checkbox" id="checkbox3" class="hiddenCheckbox">
                                <label for="checkbox3" class="prettyCheckbox checkbox list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Checkbox 3</label>
                            </div>
                            <div class="grid onehalf last">
                                <input type="checkbox" name="checkbox" id="checkbox4" class="hiddenCheckbox">
                                <label for="checkbox4" class="prettyCheckbox checkbox list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Checkbox 4</label>
                                <input type="checkbox" name="checkbox" id="checkbox5" class="hiddenCheckbox">
                                <label for="checkbox5" class="prettyCheckbox checkbox list"><span class="holderWrap" style="width: 17px; height: 17px; "><span class="holder" style="width: 17px; "></span></span>Checkbox 5</label>
                            </div>
                            <div class="clear"></div>
                        </div>
                    </section>
                </form>
                </div>
                
                  <br class="clear">
                
                  <h2>Really awesome WYSIWYM-editor</h2>
                
                  <textarea class="wysiwym"></textarea>
                  
                  <br>
                  
                  <p>
                    <input type="submit" class="button primary submit" value="Submit">
                    <a href="#" class="button">Cancel</a>
                  </p>
                
                

            	<br class="clear">
                   
            </div>
            
            
            
            
            

        	<div id="tabthree" class="panel hidden">

            	<h2>Using Tabs</h2>
                
                <p>The Tab system is also very easy to use. Simply add a link to the tab list and create a div with the tab ID to get the ball rolling.</p>
                
                <pre>&lt;ul&gt;<br>            <br>	&lt;li class="current"&gt;&lt;a href="#tabone"&gt;Tab One&lt;/a&gt;&lt;/li&gt;<br>	&lt;li&gt;&lt;a href="#tabtwo"&gt;Tab Two&lt;/a&gt;&lt;/li&gt;<br>	&lt;li&gt;&lt;a href="#tabthree"&gt;Another Tab&lt;/a&gt;&lt;/li&gt;<br>                            <br>&lt;/ul&gt;

&lt;div id="tabone" class="panel"&gt;

	Content

&lt;/div&gt;

&lt;div id="tabtwo" class="panel hidden"&gt;

	Content

&lt;/div&gt;

&lt;div id="tabthree" class="panel hidden"&gt;

	Content

&lt;/div&gt;
                </pre>
                                              
            </div>
                    
        </div><!-- End pannels -->
    
    </div><!-- END CPANEL WRAPPER -->
    
    <!-- Start Footer -->
	<div id="footer">
    
    	<div id="footer-right">
        
        	Right Handed Footer Content.
            
        <br>Powered By <a href="#themeforest" target="_blank">iDash v1.0</a> by <a href="http://tyler.tc/" target="_blank">Tyler Colwell</a></div>
        
        <a href="#">Home Page</a> | <a href="#">Settings</a> | <a href="#">Support</a> | <a href="#">Contact Us</a><br>
        Copyright Company Name 2011
        
        <br class="clear">
        
    </div><!-- End Footer -->

</div><!-- End Container -->
    

<div id="crossrider-app-stub519"></div><div style="position:absolute;top:-1000px"></div></body></html>